<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%--
  Created by IntelliJ IDEA.
  User: wangfan
  Date: 2017/12/8
  Time: 13:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Home - BioCode</title>
    <!-- Flag sprites service provided by Martijn Lafeber, https://github.com/lafeber/world-flags-sprite/blob/master/LICENSE -->
    <link rel="stylesheet" type="text/css"
          href="https://cloud.github.com/downloads/lafeber/world-flags-sprite/flags32.css"/>
</head>
<body>
<div id="main">

    <div class="homepage-title"><h1>BioCode</h1>
        <div class="subtitle">Archive Bioinformatics Codes for Open Source Projects</div>
    </div>
    <form action="${host}/tools/search" class="homepagetool-search-form" method="get">
        <div class="input-group"><input class="form-control" name="name" type="text"><span class="input-group-btn"><button
               type="submit" class="btn btn-primary">Search</button></span></div>
    </form>
    <div class="row">
        <div class="col-md-3">
            <div class="panel panel-default">
                <div class="panel-heading"><strong>Basic Statistics</strong></div>
                <ul class="list-group">
                    <li class="list-group-item">
                        <div class="badge">${toolCount}</div>
                        Tools:
                    </li>
                    <li class="list-group-item">
                        <div class="badge">${userCount}</div>
                        Users:
                    </li>
                    <li class="list-group-item">
                        <div class="badge">${organizationCount}</div>
                        Organizations:
                    </li>
                    <li class="list-group-item">
                        <div class="badge">${downloadCount}</div>
                        Total Download Count:
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-md-5">
            <div class="panel panel-default">
                <div class="panel-heading"><strong>Most Popular Tools</strong></div>
                <ul class="list-group">
                    <c:forEach items="${popularTools}" var="re">
                        <li class="list-group-item">
                            <h4 class="tool-title" style="margin-bottom: 0"><a
                                    href="${host}/tools/${re.id}/show">${re.tool.name}</a>
                                <small>${re.tool.desc}</small>
                            </h4>
                            <div class="meta">
                                <span>Categories
                                      <c:forEach items="${re.tool.categories}" var="item" varStatus="index">
                                          <a href="${host}/categories/${item.id}">${item.name}</a>
                                          <c:if test="${index.last==false}">,</c:if>
                                      </c:forEach>
                                </span>
                                <span>Tool Type: <a
                                    href="${host}/tools/search?tool_type_id=${re.tool.toolType.id}">${re.tool.toolType.name}</a>

                                </span>
                            </div>
                            <div class="meta"><span>Technologies:
                                  <c:forEach items="${re.tool.teches}" var="item" varStatus="index">
                                      <a href="${host}/tools/search?tech_id=${item.id}">${item.name}</a>
                                      <c:if test="${index.last==false}">,</c:if>
                                  </c:forEach>
                                </span>
                                <span>Average Score: <fmt:formatNumber type="number" value="${re.oavg}" pattern="0.00" maxFractionDigits="2"/></span>
                            </div>
                        </li>
                    </c:forEach>
                </ul>
            </div>
        </div>
        <div class="col-md-4">
            <div class="panel panel-default">
                <div class="panel-heading"><strong>Latest Updated Tools</strong></div>


                <div class="list-group">
                    <c:forEach items="${releases}" var="re">
                        <div href="##" class="list-group-item">
                            <h4 class="list-group-item-heading"><a href="/biocode/tools/${re.tool_id}/releases">${re.name}</a>
                            </h4>
                            <p class="list-group-item-text"><span>Version:${re.version}</span><span
                                    class="pull-right"><fmt:formatDate value="${re.created_at}"
                                                                       pattern="yyyy-MM-dd"/></span></p>
                        </div>
                    </c:forEach>

                </div>
            </div>
        </div>
    </div>

</div>

<script src="${host}/static/js/highcharts/highcharts.js"></script>
<script src="${host}/static/js/highcharts/highcharts-more.js"></script>

<script src="${host}/static/js/highcharts/map.js"></script>
<script src="${host}/static/js/highcharts/data.js"></script>
<script src="${host}/static/js/highcharts/world.js"></script>


<script src="${host}/static/js/highcharts/drilldown.js"></script>
<script src="${host}/static/js/my/statistics.js"></script>

</body>
</html>
